layui.use(['table', 'layer'], function () {
    var layer = parent.layer === undefined ? layui.layer : top.layer,
        $ = layui.jquery,
        table = layui.table;

    /**
     * 加载数据表格
     */
    var tableIns = table.render({
        id: "saleChanceTable"   // 用来操作表格的标识
        , elem: '#saleChanceList'  // 绑定容器元素的ID属性值
        , height: 'full-125'  // 容器的高度 full-差值
        , cellMinWidth: 95  // 单元格最小宽度
        // 设置flag参数，表示查询的是客户开发计划
        , url: ctx + '/sale_chance/list?flag=1' // 访问数据的URL（后台的数据接口）
        , page: true // 开启分页
        , limit: 10 // 默认每页显示的数量
        , limits: [10, 20, 30, 40, 50]  // 每页页数的可选项
        , toolbar: '#toolbarDemo' // 开启表格头部工具栏，需要绑定需要显示的Id值
        , cols: [[ // 表头
            // 【field: 要求field属性值与返回的数据中对应的属性字段名一致】
            // title：设置列的标题
            // sort: 是否允许排序（默认：false）
            // fixed: 固定列
            {type: 'checkbox', fixed: 'center'}
            , {field: 'id', title: '编号', width: 80, sort: true, fixed: 'left'}
            , {field: 'chanceSource', title: '机会来源', align: 'center'}
            , {field: 'customerName', title: '客户名称', align: 'center'}
            , {field: 'cgjl', title: '成功几率', align: 'center'}
            , {field: 'overview', title: '概要', align: 'center'}
            , {field: 'linkMan', title: '联系人', align: 'center'}
            , {field: 'linkPhone', title: '联系电话', align: 'center', width: 120}
            , {field: 'description', title: '描述', align: 'center'}
            , {field: 'createMan', title: '创建人', align: 'center'}
            , {field: 'createDate', title: '创建时间', align: 'center', width: 120}
            , {field: 'updateDate', title: '修改时间', align: 'center', width: 110}
            , {
                field: 'devResult', title: '开发状态', align: 'center', templet: function (d) {
                    // 调用函数，返回格式化的结果
                    return formatDevResult(d.devResult);
                }
            }
            // , {field: 'isValid', title: '创建人', align: 'center'}
            , {title: '操作', templet: '#op', fixed: 'right', align: 'center', minWidth: 150}
        ]]
    });


    /**
     * 格式化开发状态
     * 0 = 未开发
     * 1 = 开发中
     * 2 = 开发成功
     * 3 = 开发失败
     * 4 = 未知
     * @param devResult
     */
    function formatDevResult(devResult) {
        if (devResult == 0) {
            return "<div style='color:grey'>未开发</div>"
        } else if (devResult == 1) {
            return "<div style='color:orange'>开发中</div>"
        } else if (devResult = 2) {
            return "<div style='color:green'>开发成功</div>"
        } else if (devResult = 3) {
            return "<div style='color:red'>开发失败</div>"
        } else {
            return "<div style='color:blue'>未知</div>"
        }
    }

    /**
     * 搜索 按钮点击事件，点击搜索，传入参数请求后台返回结果，重载表格
     */
    $(".search_btn").click(function () {
        /**
         * 表格重载：
         * -- 多条件查询
         */
        tableIns.reload({
            // 设置需要传递给后端的参数
            where: { // 设定异步数据接口的额外参数，任意设
                // 通过文本框/下拉框的值，设置传递参数
                customerName: $("[name='customerName']").val() // 客户名
                , createMan: $("[name='createMan']").val() // 创建人
                , devResult: $("#devResult").val() // 开发装填
            }
            , page: {
                curr: 1 // 重新从第 1 页开始
            }
        });
    });

    /**
     * 行工具栏监听 通过 table.on() 选取元素
     * 格式：
     * table.on('tool(数据表格的lay-filter属性值)', function (data) {
     * })
     */
    table.on('tool(saleChances)', function (data) {
        // 判断类型，从 lay-event="dev" 中判断事件类型
        if (data.event == "dev") { // 开发

            // 打开计划项开发与详情页面
            openCusDevPlanDialog("计划项数据开发", data.data.id);

        } else if (data.event == "info") { // 详情
            // 打开计划项开发与详情页面
            openCusDevPlanDialog("计划项数据维护", data.data.id);
        }
    })

    /**
     * 打开计划项开发或详情页面
     * @param title
     * @param id
     */
    function openCusDevPlanDialog(title, id) {

        // 打开 iframe 层，即打开一个窗口
        // layer.open({ // 没有加 layui. 最大化时就会是占满整个浏览器窗口
        layui.layer.open({  // 【加了layui. 最大化时，就会在父窗口里面
            // 弹出层的类型
            type: 2,
            // 标题
            title: title,
            // 宽高
            area: ['750px', '550px'],
            // 内容页面的url地址
            content: ctx + "/cus_dev_plan/toCusDevPlanPage?id=" + id,
            // 开启最大化最小化按钮
            maxmin: true
        });
    }

});
